import { $ } from './library/jquery-module.js';
import './library/jQuery-extend-drag.js';

$(function() {
    // 注册协议
    let probox = $('#regiprotol');
    $('.agreepro-btn').on('click', function() {
        probox.remove();
    });

    // 手机区号选择
    console.log(2)

    $.getJSON('../js/register-area.json', "", function(data) {
        let temp;
        data.forEach(function(elm) {
            console.log(elm);
            temp += `<option value="">
                    <span>${elm.city}</span>
                    <span>${elm.code}</span>
                </option>`;
        });
        $('#register-area').html(temp);
        $('#register-area').children('option').eq(0).attr('selected', 'selected')

    });
    console.log(3)

    // 手机号正则验证
    let reg = /^1[3-9]\d{9}$/;
    let res;
    $('.regiphone').on('click', function() {
        $(document).bind('click', function(ev) {
            if ($(ev.target).closest('.regiphone').length == 0 && $('.regiphone').val() == 0) {
                $('.regiphone').addClass('wrong-prompt');
                $('.phone-wrong').css('display', 'inline-block');
                $('.test-prompt').text('请输入你的手机号码');
            } else {
                $('.regiphone').on('change', function() {
                    res = reg.test($(this).val()) ? true : false;

                    if (res) {
                        $('.phone-right').css('display', 'inline-block');
                        $('.phone-wrong').css('display', 'none');
                        $('.test-prompt').text('');
                        $('.regiphone').removeClass('wrong-prompt');
                    } else {
                        $('.phone-right').css('display', 'none');
                        $('.phone-wrong').css('display', 'inline-block');
                        $('.test-prompt').text('手机号码格式不正确，请重新输入');
                        $('.regiphone').addClass('wrong-prompt');
                    }

                });
            }
        });
    });

    // 验证滑块
    $('#drag').drag({
        fn: function() {
            if ($('.handler').hasClass('handler_ok_bg')) {
                $('.enter-next').addClass('enter-next-ok');

                // 进入下一步
                $('.enter-next').on('click', function() {
                    $('.phonenum-test').css('display', 'none');
                    $('.user-exist').css('display', 'block');

                    // 验证手机
                    $('.register-number').text($('.regiphone').val());

                    let timer;
                    let num = 59;
                    $('.get-code').text(`重发验证码(${num}s)`);
                    timer = setInterval(function() {
                        num--;
                        if (num > 0) {
                            $('.get-code').text(`重发验证码(${num}s)`);
                        } else {
                            clearInterval(timer);
                            $('.get-code').text(`免费获取验证码`);
                        }
                    }, 1000);

                    // 验证码用户输入的验证码
                    $('.code-test-sure').on('click', function() {
                        let val = $('.code-fill').val();
                        if (val.length != 6) {
                            $('.code-wrong').css('display', 'inline');
                            $('.code-right').css('display', 'none');
                            $('.code-send-already').css('color', '#FF0036');
                            $('.code-send-already').text('校验码是6位数字，请重新输入');
                        } else if (val.length == 6 && val != '222333') {
                            $('.code-wrong').css('display', 'inline');
                            $('.code-right').css('display', 'none');
                            $('.code-send-already').css('color', '#FF0036');
                            $('.code-send-already').text('校验码不正确，请重新输入');
                        } else if (val == '222333') {
                            // $('.code-send-already').text('注册成功');
                            let phone = $('.register-number').text();
                            $.ajax({
                                type: "post",
                                url: "../../interface/register.php",
                                data: { "phone": phone },
                                dataType: "text",
                                success: function(data) {
                                    if (data == 0) {
                                        alert('该用户已存在');
                                    } else if (data == 1) {
                                        alert('注册成功');
                                    }
                                }
                            });
                        }
                    });

                })
            }
        }
    });

});